const { defineConfig } = require('@vue/cli-service');
const { VantResolver } = require('unplugin-vue-components/resolvers');
const ComponentsPlugin = require('unplugin-vue-components/webpack');
const path = require('path');
function resolve(dir) {
  return path.join(__dirname, dir);
}

module.exports = defineConfig({
  transpileDependencies: true,
  lintOnSave: false,

  chainWebpack(config) {
    config.module
      .rule('svg')
      .exclude.add(resolve('src/icons'))
      //  exclude  除了   我们src 目录中 icons 中的 svg图片
      .end();

    //  防止被默认打包进了项目

    //  用了 这个svg 我们就打包这个svg
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/icons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]',
      })
      .end();

    config.when(process.env.NODE_ENV === 'production', (config) => {
      // 生产环境
      config.set('externals', {
        vue: 'Vue',
        axios: 'axios',
      });

      //  如果上线环境, 那么不打包 vue axios   取消依赖

      config.plugin('html').tap((args) => {
        args[0].title = 'ReadaBook';
        args[0].isProd = true;

        return args;
      });
    });
  },

  //  跨域问题:  同源策略的问题,  用服务器去访问服务器
  configureWebpack: {
    plugins: [
      ComponentsPlugin({
        resolvers: [VantResolver()],
      }),
    ],
    resolve: {
      alias: {
        // @指向src目录
        '@': path.join(__dirname, 'src'),
        //配置api目录
        '@api': path.join(__dirname, 'src/api'),
        //配置util目录
        '@util': path.join(__dirname, 'src/util'),
        '@com': path.join(__dirname, 'src/components'),
      },
      // 可以忽略以下扩展名，会按照顺序依次匹配
      extensions: ['.js', '.json', '.vue'],
    },
  },
  devServer: {
    proxy: {
      '/dev': {
        target: 'http://127.0.0.1:7001',

        // target: 'http://23.224.198.233:7001/',
        pathRewrite: {
          '^/dev': '',
        },
        changeOrigin: true,
      },
    },
    // onbefor : ()=>{  }
    onBeforeSetupMiddleware: require('./mock'),
  },
});
